import 'package:fbroadcast/fbroadcast.dart';
import 'package:flutter/material.dart';
import 'package:xvideos/assets_tool/app_colors.dart';
import 'package:xvideos/assets_tool/images.dart';
import 'package:xvideos/hj_model/video_model.dart';
import 'package:xvideos/hj_page/video/view/change_line_dialog.dart';
import 'package:xvideos/hj_utils/screen.dart';
import 'package:xvideos/tools_base/event_bus/events.dart';

import '../../../../config/address.dart';
import '../short_video_menu.dart';

class ShortRightSubMenu extends StatefulWidget {
  final VideoModel? videoModel;

  const ShortRightSubMenu({super.key, this.videoModel});

  @override
  State<StatefulWidget> createState() {
    return _ShortRightSubMenuState();
  }
}

class _ShortRightSubMenuState extends State<ShortRightSubMenu> {
  GlobalKey globalKey = GlobalKey();
  Offset? menuPosition;
  int loadStatus = 0;

  void _showMenuAlert() {
    showDialog(
      context: context,
      builder: (context) {
        return Stack(
          children: [
            Positioned(
              top: (menuPosition?.dy ?? 0) - screen.paddingTop,
              right: 38 / 0.6 - 10,
              child: Material(
                color: Colors.transparent,
                child: _buildMenuWidget(),
              ),
            ),
          ],
        );
      },
    );
  }

  void _showLineExchangeAlert() {
    showDialog(
      context: context,
      builder: (context) {
        return Stack(
          children: [
            Positioned(
              top: (menuPosition?.dy ?? 0) - screen.paddingTop + 36,
              right: 12,
              child: Material(
                color: Colors.transparent,
                child: _buildSelectLineWidget(),
              ),
            ),
          ],
        );
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: () {
        if (!ShortVideoMenu.isShow) {
          ShortVideoMenu.isShow = !ShortVideoMenu.isShow;
          ShortVideoMenu.notifyListeners();
          setState(() {});
        } else {
          RenderBox? renderBox = globalKey.currentContext?.findRenderObject() as RenderBox?;
          menuPosition = renderBox?.localToGlobal(Offset.zero) ?? Offset.zero;
          _showMenuAlert();
        }
      },
      child: Container(
        width: 36,
        key: globalKey,
        alignment: Alignment.topCenter,
        child: Image.asset(
          ShortVideoMenu.isShow ? 'dot_more.png'.videoPath : 'eye_close.png'.videoPath,
          width: 36,
          height: 36,
        ),
      ),
    );
  }

  Widget _buildMenuWidget() {
    return Container(
      width: 121,
      height: 46,
      decoration: BoxDecoration(
        color: const Color(0xff262626),
        borderRadius: BorderRadius.circular(8),
      ),
      child: Row(
        children: [
          ChangeLineButton(
            ChangeLineEntry.shortVideo,
            changeLineCallback: (String line) {
              Address.cdnAddress = line;
              FBroadcast.instance().broadcast(SWITCH_CDN_ADDRESS);
            },
          ),
          Container(width: 1, height: 24, color: Colors.white),
          _buildMenuItem(2),
        ],
      ),
    );
  }

  Widget _buildSelectLineWidget() {
    return Container(
      width: 114,
      height: 102,
      padding: EdgeInsets.only(top: 12),
      decoration: BoxDecoration(
        color: Color(0xff16152A),
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(10),
          bottomLeft: Radius.circular(10),
          bottomRight: Radius.circular(10),
        ),
      ),
      child: ListView.builder(
        padding: const EdgeInsets.only(bottom: 64),
        itemCount: Address.cdnAddressLists.length,
        itemBuilder: (context, index) {
          return GestureDetector(
            onTap: () async {
              Address.cdnAddress = Address.cdnAddressLists[index].url;
              FBroadcast.instance().broadcast(SWITCH_CDN_ADDRESS);
              Navigator.pop(context);
            },
            child: Column(
              children: [
                Container(
                  margin: const EdgeInsets.only(top: 4, bottom: 4),
                  child: Text(
                    Address.cdnAddressLists[index].desc.toString(),
                    style: TextStyle(
                      fontSize: 14,
                      color: Address.cdnAddressLists[index].url == Address.cdnAddress ? AppColors.primaryHighColor : Color(0xffDBDBDB),
                    ),
                  ),
                ),
                Container(
                  margin: const EdgeInsets.only(left: 6, right: 6),
                  height: 0.6,
                  color: Color(0xff333333),
                  width: 92,
                ),
              ],
            ),
          );
        },
      ),
    );
  }

  Widget _buildMenuItem(int index) {
    String imagePath = "";
    if (index == 1) {
      imagePath = "line_white.png".videoPath;
    } else {
      imagePath = "eye_open.png".videoPath;
    }
    return InkWell(
      onTap: () {
        Navigator.pop(context);
        if (index == 1) {
          _showLineExchangeAlert();
        } else {
          ShortVideoMenu.isShow = !ShortVideoMenu.isShow;
          ShortVideoMenu.notifyListeners();
          setState(() {});
        }
      },
      child: Container(
        width: 60,
        height: 46,
        alignment: Alignment.center,
        child: Image.asset(
          imagePath,
          width: 36,
          height: 36,
        ),
      ),
    );
  }
}
